<!--
  Generated template for the BillDetailPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>{{title}}</ion-title>
  </ion-navbar>

</ion-header>


<ion-content (ionScroll)="scrollHandler($event)" (ionScrollEnd)="ionScrollEnd($event)">
    <div class="form-box22">
        <div class="wrapper" *ngIf="listType1" >
            <div class="bill-list" *ngFor="let item of billList;index as i">
                <div class="bill-number">04-{{i}}</div>
                <div class="bill-number">1000</div>
            </div>  
            <!-- <div class="bill-list">
                <div class="bill-number">04-17</div>
                <div class="bill-number">1000</div>
            </div>  
            <div class="bill-list">
                <div class="bill-number">04-16</div>
                <div class="bill-number">1000</div>
            </div>   -->
        </div>
        <div class="wrapper" *ngIf="listType2" #wrapper>
          <div class="repeat-list" *ngFor="let item of billList">
                  <div class="bill-list-title">
                      <div>2018年</div>
                      <div>总计通行费用:￥<span>{{monery | formateMoney}}</span>  总计服务费:￥ <span>222.22 </span></div>
                    </div>

                  <div class="bill-list2">
                      <div class="bill-number">4月账单</div>
                      <div class="bill-number">
                        <span>1000</span>
                        <span class="no-pay">未还款</span>
                      </div>
                  </div>  
                  <div class="bill-list2">
                      <div class="bill-number">4月账单</div>
                      <div class="bill-number">
                          <span>1000</span>
                          <span class="pay-part">部分还款</span>
                      </div>
                  </div>  
                  <div class="bill-list2">
                      <div class="bill-number">4月账单</div>
                      <div class="bill-number">
                          <span>1000</span>
                          <span class="pay-overdate">逾期</span>
                      </div>
                  </div>   
              </div>
              
       </div>
       <!-- <div class="dataTipsBtnBox" *ngIf="billList.length>0&&hasMore">
            <div class="seeMore">
                <span>
                    <div class="loadingBox">
                        <div class="loading">
                            <img width="20" height="20" src=""> <p class="desc"></p>
                        </div>
                    </div>
                    加载更多记录
                </span>
            </div>
        </div> -->
       <div class="dataTipsBtnBox" *ngIf="billList.length>0&&!hasMore">
            <div class="seeMore noMore"><span>没有更多记录了</span>
            </div>
        </div> 
    </div>
    <div class="back-btn" *ngIf="backTopShow" (tap)="scrollToTop()"></div>
    
    <div class="tips-status-box" style="background:none;" [hidden]="!isShowNoListTips">
            <div class="ptc">
                <div class="tips-status">
                    <p class="statusImg no-message"></p> <p class="desc">还没有消息哦～</p> 
                </div>
            </div>
      </div>
    <ion-infinite-scroll (ionInfinite)="doInfinite($event)" 
    threshold="100px" *ngIf="this.hasMore">
      <ion-infinite-scroll-content
      loadingSpinner="bubbles"
      loadingText="正在加载更多..."></ion-infinite-scroll-content>
    </ion-infinite-scroll>
</ion-content>
